﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" >
    <title></title>
        <style type="text/css">
        body
        {
            width: 98%;
            font-size: 12px;
        }
        .btabs
        {
            border: 1px solid #8DB2E3;
            font-size: 12px;
            height: 26px;
            list-style-type: none;
            margin: 0;
            padding: 4px 0 0 4px;
            width: 99.5%;
            background-color: #E0ECFF;
        }
    </style>
    <link href="../js1/Treetable_files/jqtreetable.css" rel="stylesheet" type="text/css" />
    <link href="../js1/Css/default.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="../js1/easyUI/themes/default/easyui.css" />
    <link rel="stylesheet" type="text/css" href="../js1/easyUI/themes/icon.css" />
    <script type="text/javascript" src="../js1/easyUI/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="../js1/easyUI/jquery.easyui.min.js"></script>
     <script type="text/javascript" src="../js1/btns.js"></script>
    <script type="text/javascript" src="../js1/Treetable_files/jqtreetable.js"></script>
    <script src="../js1/easyUI/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>
    <link href="../css/default.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript">

        //弹出信息窗口 title:标题 msgString:提示信息 msgType:信息类型 [error,info,question,warning]
        function msgShow(title, msgString, msgType) {
            $.messager.alert(title, msgString, msgType);
        }
        $(function () {
            $('#dd2').dialog({
                closed: true,
                title: '部门管理'
            });
            $('#cc').combotree({
                url: 'ashx/OrglistHandler.ashx'
            });
            $('#test').treegrid({
                width: $('#content').width(),
                height: document.getElementById('content').height,
                nowrap: false,
                rownumbers: false,
                url: 'ashx/OrglistHandler.ashx',
                idField: 'id',
                treeField: 'text',
                frozenColumns: [[
	                    {
	                        title: '部门名称', field: 'text', width: $(this).width() * 0.25
	                    }
                ]],
                columns: [[
					    { field: 'Sort', title: '排序', width: $(this).width() * 0.15, align: 'center' },
					    { field: 'Person', title: '负责人', width: $(this).width() * 0.15, align: 'center' },
					    { field: 'Remark', title: '备注', width: $(this).width() * 0.4 }
                ]]
            });
        });
        function closedd2() {
            $('#dd2').dialog('close');
        }
        function add() {
            $('#cc').combotree({
                url: 'ashx/OrglistHandler.ashx'
            });
            $('#HdId').val('');
            $('#txtName').val('');
            $('#cc').combotree('setValue', '');
            $('#ss').numberspinner({ value: 1 });
            $('#txtPerson').val('');
            $('#txtRemark').val('');
            $('#dd2').dialog('open');
        }
        function edit() {
            var node = $('#test').treegrid('getSelected');
            if (node) {
                $('#HdId').val(node.id);
                //获取部门信息
                $('#cc').combotree({
                    url: 'ashx/OrglistHandler.ashx?Id=' + node.id
                });
                $.post('ashx/OrglistHandler.ashx?type=edit&Id=' + node.id, function (msg) {
                    var str = msg.split(',');
                    $('#txtName').val(str[0]);
                    $('#cc').combotree('setValue', str[1]);
                    //$('#ss').numberspinner({ value: str[2] });
                    $('#txtPerson').val(str[3]);
                    $('#txtRemark').val(str[4]);
                    $('#ss').numberspinner('setValue', str[2]);
                });
                $('#dd2').dialog('open');
            } else {
                msgShow('系统提示', '请选择要编辑的部门', 'error');
            }
        }
        function del() {
            var node = $('#test').treegrid('getSelected');
            if (node) {
                var nodes = $('#test').treegrid('getChildren', node.id);
            } else {
                var nodes = $('#test').treegrid('getChildren');
            }
            var s = '';
            for (var i = 0; i < nodes.length; i++) {
                if (s != '')
                    s += ',';
                s += nodes[i].id;
            }
            if (node) {
                if (s != '')
                    s += ',';
                s += node.id;
                $.messager.confirm('系统提示', '删除部门将同时删除其下面所有部门，您确定要删除吗?', function (r) {
                    if (r) {
                        //删除部门信息
                        $.post('ashx/OrglistHandler.ashx?type=del&Id=' + s, function (msg) {
                            msgShow('系统提示', '删除成功', 'info');
                            $('#test').treegrid('reload');
                        });
                    }
                });
            } else {
                msgShow('系统提示', '请选择要删除的部门', 'error');
            }


        }
        //添加/保存部门信息
        function saveOrg() {
            var name = $('#txtName').val();
            if (name != '') {
                var remark = $('#txtRemark').val();
                var parentId = $('#cc').combotree('getValue');
                var sort = $('#ss').val();
                var person = $('#txtPerson').val();
                var Id = $('#HdId').val();
                $.post('ashx/OrglistHandler.ashx?type=save&Id=' + Id + '&name=' + encodeURI(name) + '&remark=' + encodeURI(remark) + '&parentId=' + parentId + '&person=' + encodeURI(person) + '&sort=' + sort, function (msg) {
                    msgShow('系统提示', '部门编辑成功', 'info');
                    $('#dd2').dialog('close');
                    $('#test').treegrid('reload');
                });
            } else {
                msgShow('系统提示', '请输入部门名称', 'error');
            }
        }
    </script>
</head>
<body style=" background:white">
    <form id="form1" >
    <input id="HdId" type="hidden" />
    <input id="HdUserId" type="hidden" />
    <div class="btabs"> 
    <span class="icon icon-add">&nbsp;</span><a href="javascript:void(0)" onclick="add()">添加</a>
    <span class="icon icon-edit">&nbsp;</span><a href="javascript:void(0)" onclick="edit()">编辑</a> 
    <span class="icon icon-delete2">&nbsp;</span><a href="javascript:void(0)" onclick="del()">删除</a>
     </div>
    <div style="height:2px"></div>
    <div style=" width:100%" id="content">
    <table id="test"></table>
    </div>
    <div id="dd2" icon="icon-save"  style="padding: 5px; width: 460px; height: 280px;">
        <div id="divU" style=" height:200px">
            <table cellpadding="0" cellspacing="1px" border="0" style="width: 100%;" bgcolor="b5d6e6">
                <tr style="background-color: White; height: 32px;">
                    <td style=" width:80px; padding-left:5px">部门名称</td>
                    <td style=" padding:5px"><input id="txtName" type="text" style="border: 1px solid #8DB2E3; width:200px; height:20px"/></td>
                </tr>
                  <tr style="background-color: White; height: 32px;">
                    <td style=" padding:5px">上级部门</td>
                    <td style=" padding:5px"><input id="cc" class="easyui-combotree" required="true" style="width:200px;"></td>
                </tr>
                  <tr style="background-color: White; height: 32px;">
                    <td style=" padding:5px">排序</td>
                    <td style=" padding:5px"><input id="ss" class="easyui-numberspinner" min="1" max="10" required="true" style="width:80px;"></input></td>
                </tr>
                  <tr style="background-color: White; height: 32px;">
                    <td style=" padding:5px">负责人</td>
                    <td style=" padding:5px"><input id="txtPerson" type="text" maxlength="5" style="border: 1px solid #8DB2E3; width:200px; height:20px" /></td>
                </tr>
                  <tr style="background-color: White; height: 50px;">
                    <td style=" padding:5px">备注</td>
                    <td style=" padding:5px"><textarea id="txtRemark" rows="3" style=" width:280px;border: 1px solid #8DB2E3;"></textarea></td>
                </tr>
            </table>
        </div>
        <div region="south" border="false" style="text-align: right; height: 30px; line-height: 30px;">
        <a id="A3" class="easyui-linkbutton" onclick="saveOrg()" icon="icon-ok" href="javascript:void(0)">
            确定</a> <a id="A4" class="easyui-linkbutton" onclick="closedd2()" icon="icon-cancel" href="javascript:void(0)">
                取消</a>
    </div>
    </div>
     </form>
</body>
</html>